<template>
  <div v-for="(value, index) in forTable" :key="index">
    <div class="purchaseOrder">
      <div class="purchaseOrder-boxOpmm">
        <div class="purchaseOrder-titleName">浙江宏竹塑胶五金有限公司</div>
        <a-row>
          <a-col :span="8"> 请款日期:{{ newData }} </a-col>
          <a-col :span="8"> <div class="purchaseOrder-optionName">厂商预付货款请款条</div> </a-col>
          <a-col :span="8"> </a-col>
        </a-row>
      </div>
      <div class="purchaseOrder-btommmo">
        <a-row class="grid-demo">
          <a-col :span="3">
            <div>厂商名称:</div>
          </a-col>
          <a-col :span="3">
            <div>{{ topTabel.supplier }}</div>
          </a-col>
          <a-col :span="18">
            <div>{{ topTabel.supplierFullName }}</div>
          </a-col>
        </a-row>

        <a-row class="grid-demo">
          <a-col :span="3">
            <div>采购订单:</div>
          </a-col>
          <a-col :span="4">
            <div>厂商名称</div>
          </a-col>
          <a-col :span="17">
            <div>{{ EFTimeFormatConversion(topTabel.purchaseDate) }}</div>
          </a-col>
        </a-row>

        <a-row class="grid-demo">
          <a-col :span="3">
            <div>交易条件:</div>
          </a-col>
          <a-col :span="21">
            <div>预付货款/预收货款</div>
          </a-col>
        </a-row>
        <a-row class="grid-demo">
          <a-col :span="3">
            <div>交易币别:</div>
          </a-col>
          <a-col :span="4">
            <div>{{ topTabel.coinType }}</div>
          </a-col>
          <a-col :span="3">
            <div>税别</div>
          </a-col>
          <a-col :span="7">
            <div>{{ categoriesTaxesList(topTabel?.taxType).label }} {{ topTabel.tax * 100 }}%</div>
          </a-col>
          <a-col :span="7">
            <div>(内含税:{{ [1, 2].includes(topTabel.taxType) ? '是' : '零税率' }})</div>
          </a-col>
        </a-row>
        <a-row class="grid-demo">
          <a-col :span="3">
            <div>订单总金额:</div>
          </a-col>
          <a-col :span="21">
            <div>{{ topTabel.totalAmount }}</div>
          </a-col>
        </a-row>
        <a-row class="grid-demo">
          <a-col :span="3">
            <div>预付金额:</div>
          </a-col>
          <a-col :span="6">
            <div>预付货款/预收货款</div>
          </a-col>
          <a-col :span="4">
            <div>预付(</div>
          </a-col>
          <a-col :span="1">
            <div>)成,</div>
          </a-col>
          <a-col :span="5">
            <div>第(</div>
          </a-col>
          <a-col :span="2">
            <div>)次付款</div>
          </a-col>
        </a-row>
      </div>
      <div class="purchaseOrder-btommmo">备注:</div>
      <a-row>
        <a-col :span="20">
          <div class="tominasn">预付产品明细说明</div>
        </a-col>
        <a-col :span="4">
          <div class="tominasn">预付数量</div>
        </a-col>
      </a-row>
      <a-row v-for="(value, index) in value" :key="index">
        <a-col :span="20">
          <div class="ascascas">{{ value.invmbRemark }}</div>
        </a-col>
        <a-col :span="4">
          <div class="ascascas asdcas">
            <div>{{ value.pricedNumber }}</div>
            <div>{{ value.priceUnit }}</div>
          </div>
        </a-col>
      </a-row>
      <a-row style="margin-top: 10px">
        <a-col :span="8">
          <div class="aspjmpca">核准</div>
        </a-col>
        <a-col :span="8">
          <div class="aspjmpca">单主位管</div>
        </a-col>
        <a-col :span="8"> <div style="writing-mode: vertical-rl">采购员</div></a-col>
      </a-row>
    </div>
  </div>
</template>

<script lang="ts">
import { toRefs } from 'vue';
import importConfig from './purchaseOrderPrintThree';
import { categoriesTaxesList } from '@/utils/base';
import { multiplication } from '@/utils/calculationFormula';
import { EFTimeFormatConversion } from '@/utils/baseMethods';
export default {
  setup() {
    const { base, init, timeCange } = importConfig();
    init();
    return {
      ...toRefs(base),
      init,
      timeCange,
      categoriesTaxesList,
      multiplication,
      EFTimeFormatConversion,
    };
  },
};
</script>

<style lang="less" scoped>
.purchaseOrder {
  color: #333;
  font-size: 12px;
  // padding: 15px;
  width: 720px;
  &-titleName {
    text-align: center;
    font-size: 16px;
    font-weight: bold;
  }
  &-adderm {
    text-align: center;
  }
  &-phonelist {
    text-align: center;
    font-size: 12px;
  }
  &-optionName {
    text-align: center;
    font-weight: bold;
    letter-spacing: 2px;
    text-decoration: underline;
  }
  &-btommmo {
    border: 1px solid #888;
    padding: 5px;
  }
}
.tominasn {
  padding: 2px 0;
  text-align: center;
  border: 1px solid #888;
}
.ascascas {
  height: 80px;
  border: 1px solid #888;
}
.asdcas {
  text-align: right;
}
.aspjmpca {
  writing-mode: vertical-rl;
  height: 35px;
}
</style>
